<template>
  <div class="LinkMan" ref="homePage">
    <div class="bj">
      <van-nav-bar @click-left="clickleft" style="background: #ececec;" title="增加联系人" left-text="" left-arrow>
      </van-nav-bar>
    </div>
    <div style="width: 100%;height: 46px;"></div>
    <van-cell-group>
      <van-field class="border" label="姓名" v-model="name" placeholder="请输入用户名" />
      <van-field class="border" label="手机号" maxlength="11" v-model="phone" placeholder="请输入手机号" />
      <!-- <van-field label="选择证件" class="color" disabled  placeholder="身份证" @click="Select" /> -->

      <van-field class="border" v-for="(data,index) in datalist" :key='index' :label="data.Title" v-model="data.label" placeholder="请输入正确的证件号" />
      <!-- <van-field class="border" v-else label="证件号"  placeholder="" /> -->
    </van-cell-group>

    <van-cell-group>
      <van-switch-cell active-color='#46d0ca' v-model="checked" title="设为默认" />
    </van-cell-group>
    <div style="width: 100%;height: 6.25rem;display: flex;justify-content: center;align-items: center;">
      <van-button @click="PassengerDo" style="width: 80%;background:#46d0ca; color: white;" round type="default">保存</van-button>
    </div>

  </div>
</template>

<script>
  import {
    PassengerDo,
    CredentialsList,
    PassengerDetails
  } from '@/api/home.js'
  export default {

    data() {
      return {
        clintHeigth: '', //获取页面高度
        DoType: 'Add',
        name: '', //姓名
        phone: '', //电话
        // IDCardNo: '', //身份证
        // label: '身份证', //判断是否身份证
        datalist:[],
        checked: false,
        moren:'',//设置默认

      }
    },
    // beforeRouteLeave(to, from, next) {
    //         // 设置下一个路由的 meta
    //         to.meta.keepAlive = true; // C 跳转到 A 时让 A 不缓存，即刷新
    //         next();
    //     },
    mounted() {
      this.Creden()
      this.clientHeight = `${document.documentElement.clientHeight}` //document.body.clientWidth;
      // console.log(this.clientHeight);
      // let dd = 100;
      this.$refs.homePage.style.minHeight = this.clientHeight + 'px';
      let type = this.$route.query.type;
      // console.log(type)
      if(type == undefined){

      }else{
        this.DoType = this.$route.query.type;
         let data = {
           "piSN":this.$route.query.piSN
         }
         let obj = {}
         PassengerDetails(data).then(res=>{
           console.log(res)
           this.name = res.Item.RealName
           this.phone = res.Item.Mobile
           // console.log(this.datalist)
           this.datalist.forEach(v=>{
             console.log(v)
             if(typeof( res.Item[v.Key])!="undefined")
             {
               v.label = res.Item[v.Key]
             }

           })
         })
        // this.IDCardNo = this.$route.query.IDCardNo
      }
    },
    methods: {
      Creden(){
        let data = {}
        CredentialsList(data).then(res=>{
          this.datalist = res.List
          this.datalist.forEach(v=>{
            v.label = ''
          })
          // console.log(this.datalist)
        })
      },
      onSelect(item) {
        // 点击选项时默认不会关闭菜单，可以手动关闭
        this.sheetshow = false;
        this.label = item.name
        // Toast(item.name);
        this.IDType = item.value
        // console.log(this.IDType)
      },
      Select() {
        // console.log(1)
        this.sheetshow = true;
      },
      clickleft() {
        this.$router.go(-1);
        // console.log(1)
      },
      PassengerDo() {
        console.log(this.datalist)
        // let


        if (this.checked == true) {
          this.moren = 1
        } else {
          this.moren = 0
        }
        let data = {
          DoType: this.DoType,
          RealName: this.name,
          Mobile: this.phone,

          piSN: this.$route.query.piSN,
          IsDefault:this.moren,
        }
        this.datalist.forEach(v=>{
          // console.log(v)
          if (v.label != '') {
            data[v.Key] = v.label
          }

        })
        console.log(data)
        if (this.name == '') {
          this.$toast('请输入姓名');
        }
        else if (this.phone == '') {
          this.$toast('请输入手机号码');
        } else if (this.phone.length != 11) {
          this.$toast('请输入正确的手机号码');
        }
         else {
          PassengerDo(data).then(res => {
            console.log(res)
            if (res.Code == 0) {
              this.$router.go(-1);
              this.$toast("保存成功");
            } else {
              this.$toast(res.Msg);
            }
          })
        }

      },
    },
  }
</script>

<style lang="scss">
  .LinkMan {
    font-size: 14px;

    .bj {
      .van-icon {
        color: white !important;

      }
    }

    .van-cell:not(:last-child)::after {
      border: none;
    }

    .border {

      border-bottom: 1px solid #eee;
      .van-field__label{
        width: 110px;
      }
    }

    .item {
      display: flex;
      padding: 8px 10px;
      align-items: center;

      p {
        display: flex;
        align-items: center;
      }
    }
  }
</style>
